<template>
	<div class="zhengtuojianhuo">
		<van-nav-bar :fixed="true" class="navBar" title="直通拣货" left-arrow @click-left="$router.go(-1)"></van-nav-bar>




		<div class="goodsFromWarp">
				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">出库容器：</div>
						</div>

						<van-field
						   class="skuInput"
							 clearable
							 v-model="editForm.jhrq"
							 placeholder="请填写出库容器"
							@keyup="onEnter($event,do_inputspbar)"
						 />

						 <div class="searchBtn">
						 	<button :disabled="isdisabled"  @click.stop="_getStoremx()" >
						 		<van-icon name="ellipsis" color="#1989fa"  />
						 	</button>
						 </div>
				</div>

				<div class="storeWarp" >
					<van-row class="goodsName">
					  <van-col span="24"> <span>要货门店：</span>{{skuRow.ck_storeid}} - {{skuRow.storename}}</van-col>
					</van-row>

					<van-row class="goodsName">
						<van-col span="12"> <span>集货位：</span>{{skuRow.wno}}</van-col>
						<van-col span="12"> <span>转运人员：</span> {{skuRow.oper_qr}} </van-col>
					</van-row>

					<van-row class="goodsName">
					  <van-col span="12"> <span>任务状态：</span> {{skuRow.qr_status}}</van-col>
						<van-col span="12"> <span>类型：</span> {{skuRow.rwtype}} </van-col>
					</van-row>
				</div>
		</div>


		<div class="submitBtn" style="margin-bottom: 8px;">
			<van-button style="width: 120px;" type="info" :disabled="isdisabled" @click="saveGoodsBtn()">送至集货位确认</van-button>
		</div>


    <div class="table-responsive">
		  <el-table
						border
						header-row-class-name="header-table"
						height="220px"
		        :data="lingquData"
		        style="width: 100%">
					 <el-table-column type="index" 			label="序" 		    width="50" align="center"></el-table-column>
		       <el-table-column prop="subname"		label="商品"	    width="120" :show-overflow-tooltip="true"> </el-table-column>
		       <el-table-column prop="username"		label="单" 	      width="50" :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="unit" 			label="箱装"      width="60" :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="pack" 			label="箱数"      width="60" :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="qty" 				label="散数" 	    width="60" :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="yjtotqty" 	label="预计总数"  width="100" :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="oper_qr" 		label="转运人员"  width="100" :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="rwtype" 		label="任务类型"  width="100" :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="ck_storeid" label="出库门店"  :show-overflow-tooltip="true"></el-table-column>
					 <el-table-column prop="cwno" 			label="收货人"    width="120" :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="bill" 	    label="波次单号"  :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="storename" 	label="门店名称"  :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="itemid" 		label="商品编码"  :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="subid" 			label="子码"      :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="specs" 			label="商品规格"  :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="kcuom" 			label="商品单位"  :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="wno" 		    label="集货位"    :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="oper_jh" 		label="拣货人"    :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="oper_fh" 		label="复核人"    :show-overflow-tooltip="true"></el-table-column>
		       <el-table-column prop="oper_zc" 		label="装车人"    :show-overflow-tooltip="true"></el-table-column>
		 </el-table>
		</div>






		<van-overlay :show="isStoreVisible" :lock-scroll="false">
			<div class="shipandanWrapper">
					<van-sticky>
						<van-nav-bar class="navBar" title="门店列表" left-arrow @click-left="isStoreVisible = false"></van-nav-bar>
					</van-sticky>
					<div class="shipandanCon" @click.stop>
							<div  v-for="(row,i) in storeList" :key="i" class="danjuRow" @click="selectStoreClick(row,i)" >
								<van-row class="skuList">
								  <van-col span="24"> <span style="width: 100px;" >店名：</span> {{row.storename}}</van-col>
								</van-row>
								<van-row class="skuList" >
								  <van-col span="24"> <span style="width: 100px;" >集货位：</span> {{row.wno}}</van-col>
								</van-row>

								<van-row class="skuList" style="margin-bottom: 0px;">
									<van-col span="24"> <span style="width: 100px;">待集/待分：</span> {{row.df}}</van-col>
								</van-row>
							</div>
					</div>
			</div>
		</van-overlay>

	</div>
</template>

<script>

export default {
  name: 'zhitongjianhuo',
  data() {
    return {
			editForm:{
				jhrq:'',
			},
			isdisabled:true,
			lingquData:[
				{
					subname:''
				}
			],
			isStoreVisible:false,
			storeList:[],
			skuRow:{
				subname:"",
				username:"",
				unit:"",
				pack:"",
				qty:"",
				yjtotqty:"",
				oper_qr :"",
				rwtype:"",
				qr_status:"",
				ck_storeid :"",
				cwno:"",
				bill:"",
				storename :"",
				itemid:"",
				subid:"",
				specs:"",
				kcuom :"",
				wno:"",
				oper_jh:"",
				oper_fh:"",
				oper_zc:"",
				hzyjtotqty :"",
			},
		};
  },
	computed: {
	   ryuser: function(){
	     return this.GWO(true).gUSER;
	   }
	},
  methods: {
		_getStoremx(){
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
				'method':'dgate',
				'pname':'f_wmsa_y_jianhuo',
				'i':this.FNULLE([
				'opmode','Y_ZTJH_qryhzmx',
				'czyid',this.ryuser.operatorid,
				'kqid', this.ryuser.kqid,
				'jhrqid',this.editForm.jhrqid,
				])
				},'查询直通拣货门店',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					_self.storeList = rtn_json_obj
					console.log("得到查询直通拣货门店")
					console.log(rtn_json_obj)
					if(_self.storeList.length > 0){
							_self.isStoreVisible = true
					}else{
						_self.$toast.fail('暂无拣货总体信息')
					}
				}
			});
		},
		selectStoreClick(row){
				console.log(row)
		},
		do_inputspbar(pmtxt){
			console.log(pmtxt)  //扫描枪获取的参数
			this.editForm.jhrq = pmtxt
			this.lingquBtn()
		},
		lingquBtn(){
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
				'method':'dgate',
				'pname':'f_wmsa_y_jianhuo',
				'i':this.FNULLE([
				'opmode','Y_ZTJH_qryjhrq',
				'czyid',this.ryuser.operatorid,
				'kqid', this.ryuser.kqid,
				'jhrq',this.editForm.jhrq,
				])
				},'整件分拨领取任务',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					_self.lingquData = rtn_json_obj
					console.log("得到领取任务")
					console.log(rtn_json_obj)
					if(_self.lingquData.length >1){
						_self.skuRow = rtn_json_obj[0]
						if(_self.skuRow.errtext >''){
							_self.$dialog.alert({
							  title: '提示',
							  message:_self.skuRow.errtext,
							}).then(() => {
							  // on close
							});
						}else{
							_self.isdisabled = false
						}
					}else if(_self.lingquData.length == 1){
						_self.skuRow = rtn_json_obj[0]
						if(_self.skuRow.errtext >''){
							_self.$dialog.alert({
							  title: '提示',
							  message:_self.skuRow.errtext,
							}).then(() => {
							  // on close
							});
						}else{
							_self.isdisabled = false
						}
					}else{
						_self.$toast.fail('暂无拣货总体信息')
					}
				}
			});
		},
		saveGoodsBtn(){
			if(this.skuRow.wno == null && this.skuRow.ck_storeid > '' ){
				this.$dialog.confirm({
				  title:'提示',
				  message:'库区'+ this.ryuser.kqid +'门店' + this.skuRow.ck_storeid + "没有分配集货区,是否做拣货集货确认!",
					confirmButtonColor:'#1989fa',
				}).then(() => {
				    this._getSaveStore()
				}).catch(() => {
				    // on cancel
				});
			}else{
				this._getSaveStore()
			}
		},
		_getSaveStore(){
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
				'method':'dgate',
				'pname':'f_wmsa_y_jianhuo',
				'i':this.FNULLE([
				'opmode','Y_ZTJH_szjhwqr',
				'czyid',this.ryuser.operatorid,
				'kqid', this.ryuser.kqid,
				'jhrq',this.editForm.jhrq,
				'ck_storeid',this.skuRow.ck_storeid,
				'bill',this.skuRow.bill,
				'hzyjtotqty',this.skuRow.hzyjtotqty,
				])
				},'送至集货位',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					console.log("送至集货位")
					console.log(rtn_json_obj[0])
					if(rtn_json_obj[0].ret_ret == '-1'){
						_self.$toast.fail(rtn_json_obj[0].ret_mess)
					}else{
						_self.$toast.fail(rtn_json_obj[0].ret_mess)
						_self.editForm.jhrq = ''
						_self.lingquData = []
						_self.skuRow = []
						_self.isdisabled = true
					}

				}
			});
		}
  },
  mounted() {

  },
	components: {

	},
};
</script>

<style lang="scss" scoped>
	// 引入公共样式
	@import '@/assets/css/base.scss';
	@import '@/assets/css/input.scss';
	div.zhengtuojianhuo{
		padding-top: 50px;
	}

	div.storeWarp{
		font-size: 20px;
		font-weight: bold;
		.goodsName{
			margin-top:10px;
			margin-bottom: 10px;
			span{
				display: inline-block;
				width:100px;
			}
		}

	}

	.skuRow{
		font-size: 20px;
		font-weight: bold;
		width: 94%;
		margin-left: 3%;
		background-color: #EBF3FF;
		box-sizing: border-box;
		padding: 10px;
		border-radius: 10px;
		border-left: 5px solid #9FC8FF;
		.skuName{
			margin-bottom:8px;
		}
	}


div.table-responsive{
	width: 100%;
	overflow: auto;
}


.header-table th{
	background-color: #1989fa !important;
	padding: 0 !important;
}

/deep/.el-table th.el-table__cell{
	background-color: #1989fa !important;
	color: #fff !important;
	padding: 8px !important;
	color: #666;
}


/deep/.el-table .el-table__cell{
	padding: 8px !important;
}



</style>
